<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <link rel="stylesheet" href="./styles/css/index.css" />
  </head>
  <body>
    <!-- 头部导航 -->
    <div>
      <div id="header">
        <!-- 头部里左边导航 -->
        <div class="container">
          <div id="header-nav">
            <a href="">小米商城</a>
            <span class="line">|</span>
            <a href="">MIUI</a>
            <span class="line">|</span>
            <a href="">loT</a>
            <span class="line">|</span>
            <a href="">企业团购</a>
            <span class="line">|</span>
            <a href="">云服务</a>
            <span class="line">|</span>
            <a href="">天行数科</a>
            <span class="line">|</span>
            <a href="">有品</a>
            <span class="line">|</span>
            <a href="">小爱开放平台</a>
            <span class="line">|</span>
            <a href="">资质证明</a>
            <span class="line">|</span>
            <a href="">协议规则</a>
            <span class="line">|</span>
            <a href="">下载app</a>
            <span class="line">|</span>
            <a href="">Select Location</a>
            <!--           <span class="line">|</span>
 -->
          </div>

          <!-- 头部里右边登录注册 购物车内容 -->
          <div>
            <div class="cart">
              <div class="maincart">
                <a href="javascript:;"
                  ><i class="iconfont icon-caigou-xianxing"></i>
                  <span>购物车（0）</span></a
                >
              </div>
              <div class="mainboard">购物车中没有商品，赶紧选购吧</div>
            </div>
            <div class="header-info">
              <a href="./login.html">登录</a>
              <span class="line">|</span>
              <a href="./register.html">注册</a>
              <span class="line">|</span>
              <a href="">消息通知</a>
            </div>
          </div>
        </div>
        <div class="site-header">
          <div class="tab-box">
            <div class="logo">
              <a href=""><img src="./images/logo-mi2.png" alt="" /></a>
            </div>
            <div class="list-box">
              <ul class="tab-list">
                <li class="nav-category nav-item">
                  <a href="" class="link">全部商品分类</a>
                  <!-- banner里面的list -->
                  <div class="product-category">
                    <ul class="site_categoryList">
                      <li class="category-item">
                        <a href="javascript:;">手机<i>></i></a>
                        <div class="item_box children-col4 i1">
                          <ul class="children-col1 children-list">
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                          </ul>
                          <ul class="children-col1 children-list">
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                          </ul>
                          <ul class="children-col1 children-list">
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                          </ul>
                          <ul class="children-col1 children-list">
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                          </ul>
                        </div>
                      </li>
                      <li class="category-item">
                        <a href="javascript:;">电视<i>></i></a>
                        <div class="item_box children-col4 i2">
                          <ul class="children-col1 children-list">
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                          </ul>
                          <ul class="children-col1 children-list">
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                          </ul>
                          <ul class="children-col1 children-list">
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                          </ul>
                          <ul class="children-col1 children-list">
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                          </ul>
                        </div>
                      </li>
                      <li class="category-item">
                        <a href="javascript:;">笔记本 平板<i>></i></a>
                        <div class="item_box children-col4 i3">
                          <ul class="children-col1 children-list">
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                          </ul>
                          <ul class="children-col1 children-list">
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                          </ul>
                          <ul class="children-col1 children-list">
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                          </ul>
                          <ul class="children-col1 children-list">
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                          </ul>
                        </div>
                      </li>
                      <li class="category-item">
                        <a href="javascript:;">出行 穿戴<i>></i></a>
                        <div class="item_box children-col4 i4">
                          <ul class="children-col1 children-list">
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                          </ul>
                          <ul class="children-col1 children-list">
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                          </ul>
                          <ul class="children-col1 children-list">
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                          </ul>
                          <ul class="children-col1 children-list">
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                          </ul>
                        </div>
                      </li>
                      <li class="category-item">
                        <a href="javascript:;">耳机 音箱<i>></i></a>
                        <div class="item_box children-col4 i5">
                          <ul class="children-col1 children-list">
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                          </ul>
                          <ul class="children-col1 children-list">
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                          </ul>
                          <ul class="children-col1 children-list">
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                          </ul>
                          <ul class="children-col1 children-list">
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                          </ul>
                        </div>
                      </li>
                      <li class="category-item">
                        <a href="javascript:;">家电<i>></i></a>
                        <div class="item_box children-col3 i6">
                          <ul class="children-col1 children-list">
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                          </ul>
                          <ul class="children-col1 children-list">
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                          </ul>
                          <ul class="children-col1 children-list">
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                          </ul>
                          <!--  <ul class="children-col1 children-list">
                          <li>
                            <a href="javascript:;">
                              <img src="./images/list_1.webp" alt="" />
                              <span class="text">Redmi K40</span></a
                            >
                          </li>
                          <li>
                            <a href="javascript:;">
                              <img src="./images/list_1.webp" alt="" />
                              <span class="text">Redmi K40</span></a
                            >
                          </li>
                          <li>
                            <a href="javascript:;">
                              <img src="./images/list_1.webp" alt="" />
                              <span class="text">Redmi K40</span></a
                            >
                          </li>
                          <li>
                            <a href="javascript:;">
                              <img src="./images/list_1.webp" alt="" />
                              <span class="text">Redmi K40</span></a
                            >
                          </li>
                          <li>
                            <a href="javascript:;">
                              <img src="./images/list_1.webp" alt="" />
                              <span class="text">Redmi K40</span></a
                            >
                          </li>
                          <li>
                            <a href="javascript:;">
                              <img src="./images/list_1.webp" alt="" />
                              <span class="text">Redmi K40</span></a
                            >
                          </li>
                        </ul> -->
                        </div>
                      </li>
                      <li class="category-item">
                        <a href="javascript:;">智能 路由器<i>></i></a>
                        <div class="item_box children-col4 i7">
                          <ul class="children-col1 children-list">
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                          </ul>
                          <ul class="children-col1 children-list">
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                          </ul>
                          <ul class="children-col1 children-list">
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                          </ul>
                          <ul class="children-col1 children-list">
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                          </ul>
                        </div>
                      </li>
                      <li class="category-item">
                        <a href="javascript:;">电源 配件<i>></i></a>
                        <div class="item_box children-col2 i8">
                          <ul class="children-col1 children-list">
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                          </ul>
                          <ul class="children-col1 children-list">
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                          </ul>
                          <!--  <ul class="children-col1 children-list">
                          <li>
                            <a href="javascript:;">
                              <img src="./images/list_1.webp" alt="" />
                              <span class="text">Redmi K40</span></a
                            >
                          </li>
                          <li>
                            <a href="javascript:;">
                              <img src="./images/list_1.webp" alt="" />
                              <span class="text">Redmi K40</span></a
                            >
                          </li>
                          <li>
                            <a href="javascript:;">
                              <img src="./images/list_1.webp" alt="" />
                              <span class="text">Redmi K40</span></a
                            >
                          </li>
                          <li>
                            <a href="javascript:;">
                              <img src="./images/list_1.webp" alt="" />
                              <span class="text">Redmi K40</span></a
                            >
                          </li>
                          <li>
                            <a href="javascript:;">
                              <img src="./images/list_1.webp" alt="" />
                              <span class="text">Redmi K40</span></a
                            >
                          </li>
                          <li>
                            <a href="javascript:;">
                              <img src="./images/list_1.webp" alt="" />
                              <span class="text">Redmi K40</span></a
                            >
                          </li>
                        </ul>
                        <ul class="children-col1 children-list">
                          <li>
                            <a href="javascript:;">
                              <img src="./images/list_1.webp" alt="" />
                              <span class="text">Redmi K40</span></a
                            >
                          </li>
                          <li>
                            <a href="javascript:;">
                              <img src="./images/list_1.webp" alt="" />
                              <span class="text">Redmi K40</span></a
                            >
                          </li>
                          <li>
                            <a href="javascript:;">
                              <img src="./images/list_1.webp" alt="" />
                              <span class="text">Redmi K40</span></a
                            >
                          </li>
                          <li>
                            <a href="javascript:;">
                              <img src="./images/list_1.webp" alt="" />
                              <span class="text">Redmi K40</span></a
                            >
                          </li>
                          <li>
                            <a href="javascript:;">
                              <img src="./images/list_1.webp" alt="" />
                              <span class="text">Redmi K40</span></a
                            >
                          </li>
                          <li>
                            <a href="javascript:;">
                              <img src="./images/list_1.webp" alt="" />
                              <span class="text">Redmi K40</span></a
                            >
                          </li>
                        </ul> -->
                        </div>
                      </li>
                      <li class="category-item">
                        <a href="javascript:;">健康 儿童<i>></i></a>
                        <div class="item_box children-col3 i9">
                          <!--   <ul class="children-col1 children-list">
                          <li>
                            <a href="javascript:;">
                              <img src="./images/list_1.webp" alt="" />
                              <span class="text">Redmi K40</span></a
                            >
                          </li>
                          <li>
                            <a href="javascript:;">
                              <img src="./images/list_1.webp" alt="" />
                              <span class="text">Redmi K40</span></a
                            >
                          </li>
                          <li>
                            <a href="javascript:;">
                              <img src="./images/list_1.webp" alt="" />
                              <span class="text">Redmi K40</span></a
                            >
                          </li>
                          <li>
                            <a href="javascript:;">
                              <img src="./images/list_1.webp" alt="" />
                              <span class="text">Redmi K40</span></a
                            >
                          </li>
                          <li>
                            <a href="javascript:;">
                              <img src="./images/list_1.webp" alt="" />
                              <span class="text">Redmi K40</span></a
                            >
                          </li>
                          <li>
                            <a href="javascript:;">
                              <img src="./images/list_1.webp" alt="" />
                              <span class="text">Redmi K40</span></a
                            >
                          </li>
                        </ul> -->
                          <ul class="children-col1 children-list">
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                          </ul>
                          <ul class="children-col1 children-list">
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                          </ul>
                          <ul class="children-col1 children-list">
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                          </ul>
                        </div>
                      </li>
                      <li class="category-item">
                        <a href="javascript:;">生活 箱包<i>></i></a>
                        <div class="item_box children-col4 i10">
                          <ul class="children-col1 children-list">
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                          </ul>
                          <ul class="children-col1 children-list">
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                          </ul>
                          <ul class="children-col1 children-list">
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                          </ul>
                          <ul class="children-col1 children-list">
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                            <li>
                              <a href="javascript:;">
                                <img src="./images/list_1.webp" alt="" />
                                <span class="text">Redmi K40</span></a
                              >
                            </li>
                          </ul>
                        </div>
                      </li>
                    </ul>
                  </div>
                </li>
                <li class="nav-item">
                  <a href="" class="link">Xiaomi手机</a>
                  <!-- ------------------------------------------- -->
                  <!-- -------------tab-box移入要显示的盒子-------- -->
                  <!-- ------------------------------------------- -->
                  <div class="item-children">
                    <div class="child-container">
                      <ul class="children-list">
                        <li class="first">
                          <a href="">
                            <div class="figure">
                              <img
                                src="./images/Xiaomi_1.webp"
                                alt="Xiaomi Civi 1s"
                                width="160"
                                height="110"
                              />
                            </div>
                            <div class="title">Xiaomi Civi 1s</div>
                            <p class="price">2299元起</p>
                          </a>
                        </li>
                        <li>
                          <a href="">
                            <div class="figure">
                              <img
                                src="./images/Xiaomi_2.webp"
                                alt="Xiaomi Civi 1s"
                                width="160"
                                height="110"
                              />
                            </div>
                            <div class="title">Xiaomi Civi 1s</div>
                            <p class="price">2299元起</p>
                          </a>
                        </li>
                        <li>
                          <a href="">
                            <div class="figure">
                              <img
                                src="./images/Xiaomi_3.webp"
                                alt="Xiaomi Civi 1s"
                                width="160"
                                height="110"
                              />
                            </div>
                            <div class="title">Xiaomi Civi 1s</div>
                            <p class="price">2299元起</p>
                          </a>
                        </li>
                        <li>
                          <a href="">
                            <div class="figure">
                              <img
                                src="./images/Xiaomi_4.webp"
                                alt="Xiaomi Civi 1s"
                                width="160"
                                height="110"
                              />
                            </div>
                            <div class="title">Xiaomi Civi 1s</div>
                            <p class="price">2299元起</p>
                          </a>
                        </li>
                        <li>
                          <a href="">
                            <div class="figure">
                              <img
                                src="./images/xiaomi_5.webp"
                                alt="Xiaomi Civi 1s"
                                width="160"
                                height="110"
                              />
                            </div>
                            <div class="title">Xiaomi Civi 1s</div>
                            <p class="price">2299元起</p>
                          </a>
                        </li>
                        <li>
                          <a href="">
                            <div class="figure">
                              <img
                                src="./images/Xiaomi_6.webp"
                                alt="Xiaomi Civi 1s"
                                width="160"
                                height="110"
                              />
                            </div>
                            <div class="title">Xiaomi Civi 1s</div>
                            <p class="price">2299元起</p>
                          </a>
                        </li>
                      </ul>
                    </div>
                  </div>
                </li>
                <li class="nav-item">
                  <a href="" class="link">Redmi手机</a>
                  <!-- ------------------------------------------- -->
                  <!-- -------------tab-box移入要显示的盒子-------- -->
                  <!-- ------------------------------------------- -->
                  <div class="item-children">
                    <div class="child-container">
                      <ul class="children-list">
                        <li class="first">
                          <a href="">
                            <div class="figure">
                              <img
                                src="./images/R_1.webp"
                                alt="Xiaomi Civi 1s"
                                width="160"
                                height="110"
                              />
                            </div>
                            <div class="title">Redmi Note 11pro+</div>
                            <p class="price">2299元起</p>
                          </a>
                        </li>
                        <li>
                          <a href="">
                            <div class="figure">
                              <img
                                src="./images/R_2.webp"
                                alt="Xiaomi Civi 1s"
                                width="160"
                                height="110"
                              />
                            </div>
                            <div class="title">Xiaomi Civi 1s</div>
                            <p class="price">2299元起</p>
                          </a>
                        </li>
                        <li>
                          <a href="">
                            <div class="figure">
                              <img
                                src="./images/R_3.webp"
                                alt="Xiaomi Civi 1s"
                                width="160"
                                height="110"
                              />
                            </div>
                            <div class="title">Xiaomi Civi 1s</div>
                            <p class="price">2299元起</p>
                          </a>
                        </li>
                        <li>
                          <a href="">
                            <div class="figure">
                              <img
                                src="./images/R_4.webp"
                                alt="Xiaomi Civi 1s"
                                width="160"
                                height="110"
                              />
                            </div>
                            <div class="title">Xiaomi Civi 1s</div>
                            <p class="price">2299元起</p>
                          </a>
                        </li>
                        <li>
                          <a href="">
                            <div class="figure">
                              <img
                                src="./images/R_5.webp"
                                alt="Xiaomi Civi 1s"
                                width="160"
                                height="110"
                              />
                            </div>
                            <div class="title">Xiaomi Civi 1s</div>
                            <p class="price">2299元起</p>
                          </a>
                        </li>
                        <li>
                          <a href="">
                            <div class="figure">
                              <img
                                src="./images/R_6.webp"
                                alt="Xiaomi Civi 1s"
                                width="160"
                                height="110"
                              />
                            </div>
                            <div class="title">Xiaomi Civi 1s</div>
                            <p class="price">2299元起</p>
                          </a>
                        </li>
                      </ul>
                    </div>
                  </div>
                </li>
                <li class="nav-item">
                  <a href="" class="link">电视</a>
                  <!-- ------------------------------------------- -->
                  <!-- -------------tab-box移入要显示的盒子-------- -->
                  <!-- ------------------------------------------- -->
                  <div class="item-children">
                    <div class="child-container">
                      <ul class="children-list">
                        <li class="first">
                          <a href="">
                            <div class="figure">
                              <img
                                src="./images/w_1.webp"
                                alt="Xiaomi Civi 1s"
                                width="160"
                                height="110"
                              />
                            </div>
                            <div class="title">Redmi Note 11pro+</div>
                            <p class="price">2299元起</p>
                          </a>
                        </li>
                        <li>
                          <a href="">
                            <div class="figure">
                              <img
                                src="./images/w_2.webp"
                                alt="Xiaomi Civi 1s"
                                width="160"
                                height="110"
                              />
                            </div>
                            <div class="title">Xiaomi Civi 1s</div>
                            <p class="price">2299元起</p>
                          </a>
                        </li>
                        <li>
                          <a href="">
                            <div class="figure">
                              <img
                                src="./images/w_3.webp"
                                alt="Xiaomi Civi 1s"
                                width="160"
                                height="110"
                              />
                            </div>
                            <div class="title">Xiaomi Civi 1s</div>
                            <p class="price">2299元起</p>
                          </a>
                        </li>
                        <li>
                          <a href="">
                            <div class="figure">
                              <img
                                src="./images/w_4.webp"
                                alt="Xiaomi Civi 1s"
                                width="160"
                                height="110"
                              />
                            </div>
                            <div class="title">Xiaomi Civi 1s</div>
                            <p class="price">2299元起</p>
                          </a>
                        </li>
                        <li>
                          <a href="">
                            <div class="figure">
                              <img
                                src="./images/w_5.webp"
                                alt="Xiaomi Civi 1s"
                                width="160"
                                height="110"
                              />
                            </div>
                            <div class="title">Xiaomi Civi 1s</div>
                            <p class="price">2299元起</p>
                          </a>
                        </li>
                        <li>
                          <a href="">
                            <div class="figure">
                              <img
                                src="./images/w_1.webp"
                                alt="Xiaomi Civi 1s"
                                width="160"
                                height="110"
                              />
                            </div>
                            <div class="title">Xiaomi Civi 1s</div>
                            <p class="price">2299元起</p>
                          </a>
                        </li>
                      </ul>
                    </div>
                  </div>
                </li>
                <li class="nav-item">
                  <a href="" class="link">笔记本</a>
                  <!-- ------------------------------------------- -->
                  <!-- -------------tab-box移入要显示的盒子-------- -->
                  <!-- ------------------------------------------- -->
                  <div class="item-children">
                    <div class="child-container">
                      <ul class="children-list">
                        <li class="first">
                          <a href="">
                            <div class="figure">
                              <img
                                src="./images/b_1.webp"
                                alt="Xiaomi Civi 1s"
                                width="160"
                                height="110"
                              />
                            </div>
                            <div class="title">Redmi Note 11pro+</div>
                            <p class="price">2299元起</p>
                          </a>
                        </li>
                        <li>
                          <a href="">
                            <div class="figure">
                              <img
                                src="./images/b_2.webp"
                                alt="Xiaomi Civi 1s"
                                width="160"
                                height="110"
                              />
                            </div>
                            <div class="title">Xiaomi Civi 1s</div>
                            <p class="price">2299元起</p>
                          </a>
                        </li>
                        <li>
                          <a href="">
                            <div class="figure">
                              <img
                                src="./images/b_2.webp"
                                alt="Xiaomi Civi 1s"
                                width="160"
                                height="110"
                              />
                            </div>
                            <div class="title">Xiaomi Civi 1s</div>
                            <p class="price">2299元起</p>
                          </a>
                        </li>
                        <li>
                          <a href="">
                            <div class="figure">
                              <img
                                src="./images/b_1.webp"
                                alt="Xiaomi Civi 1s"
                                width="160"
                                height="110"
                              />
                            </div>
                            <div class="title">Xiaomi Civi 1s</div>
                            <p class="price">2299元起</p>
                          </a>
                        </li>
                        <li>
                          <a href="">
                            <div class="figure">
                              <img
                                src="./images/b_2.webp"
                                alt="Xiaomi Civi 1s"
                                width="160"
                                height="110"
                              />
                            </div>
                            <div class="title">Xiaomi Civi 1s</div>
                            <p class="price">2299元起</p>
                          </a>
                        </li>
                        <li>
                          <a href="">
                            <div class="figure">
                              <img
                                src="./images/b_2.webp"
                                alt="Xiaomi Civi 1s"
                                width="160"
                                height="110"
                              />
                            </div>
                            <div class="title">Xiaomi Civi 1s</div>
                            <p class="price">2299元起</p>
                          </a>
                        </li>
                      </ul>
                    </div>
                  </div>
                </li>
                <li class="nav-item">
                  <a href="" class="link">平板</a>
                  <!-- ------------------------------------------- -->
                  <!-- -------------tab-box移入要显示的盒子-------- -->
                  <!-- ------------------------------------------- -->
                  <div class="item-children">
                    <div class="child-container">
                      <ul class="children-list">
                        <li class="first">
                          <a href="">
                            <div class="figure">
                              <img
                                src="./images/p_1.webp"
                                alt="Xiaomi Civi 1s"
                                width="160"
                                height="110"
                              />
                            </div>
                            <div class="title">Redmi Note 11pro+</div>
                            <p class="price">2299元起</p>
                          </a>
                        </li>
                        <li>
                          <a href="">
                            <div class="figure">
                              <img
                                src="./images/p_2.webp"
                                alt="Xiaomi Civi 1s"
                                width="160"
                                height="110"
                              />
                            </div>
                            <div class="title">Xiaomi Civi 1s</div>
                            <p class="price">2299元起</p>
                          </a>
                        </li>
                        <li>
                          <a href="">
                            <div class="figure">
                              <img
                                src="./images/p_3.webp"
                                alt="Xiaomi Civi 1s"
                                width="160"
                                height="110"
                              />
                            </div>
                            <div class="title">Xiaomi Civi 1s</div>
                            <p class="price">2299元起</p>
                          </a>
                        </li>

                        <li>
                          <a href="">
                            <div class="figure">
                              <img
                                src="./images/p_1.webp"
                                alt="Xiaomi Civi 1s"
                                width="160"
                                height="110"
                              />
                            </div>
                            <div class="title">Xiaomi Civi 1s</div>
                            <p class="price">2299元起</p>
                          </a>
                        </li>
                      </ul>
                    </div>
                  </div>
                </li>
                <li class="nav-item">
                  <a href="" class="link">家电</a>
                  <!-- ------------------------------------------- -->
                  <!-- -------------tab-box移入要显示的盒子-------- -->
                  <!-- ------------------------------------------- -->
                  <div class="item-children">
                    <div class="child-container">
                      <ul class="children-list">
                        <li class="first">
                          <a href="">
                            <div class="figure">
                              <img
                                src="./images/j_1.webp"
                                alt="Xiaomi Civi 1s"
                                width="160"
                                height="110"
                              />
                            </div>
                            <div class="title">Redmi Note 11pro+</div>
                            <p class="price">2299元起</p>
                          </a>
                        </li>
                        <li>
                          <a href="">
                            <div class="figure">
                              <img
                                src="./images/j_2.webp"
                                alt="Xiaomi Civi 1s"
                                width="160"
                                height="110"
                              />
                            </div>
                            <div class="title">Xiaomi Civi 1s</div>
                            <p class="price">2299元起</p>
                          </a>
                        </li>
                        <li>
                          <a href="">
                            <div class="figure">
                              <img
                                src="./images/j_3.webp"
                                alt="Xiaomi Civi 1s"
                                width="160"
                                height="110"
                              />
                            </div>
                            <div class="title">Xiaomi Civi 1s</div>
                            <p class="price">2299元起</p>
                          </a>
                        </li>
                        <li>
                          <a href="">
                            <div class="figure">
                              <img
                                src="./images/j_4.webp"
                                alt="Xiaomi Civi 1s"
                                width="160"
                                height="110"
                              />
                            </div>
                            <div class="title">Xiaomi Civi 1s</div>
                            <p class="price">2299元起</p>
                          </a>
                        </li>
                      </ul>
                    </div>
                  </div>
                </li>
                <li class="nav-item">
                  <a href="" class="link">路由器</a>
                  <!-- ------------------------------------------- -->
                  <!-- -------------tab-box移入要显示的盒子-------- -->
                  <!-- ------------------------------------------- -->
                  <div class="item-children">
                    <div class="child-container">
                      <ul class="children-list">
                        <li class="first">
                          <a href="">
                            <div class="figure">
                              <img
                                src="./images/l-1.webp"
                                alt="Xiaomi Civi 1s"
                                width="160"
                                height="110"
                              />
                            </div>
                            <div class="title">Redmi Note 11pro+</div>
                            <p class="price">2299元起</p>
                          </a>
                        </li>
                        <li>
                          <a href="">
                            <div class="figure">
                              <img
                                src="./images/l-2.webp"
                                alt="Xiaomi Civi 1s"
                                width="160"
                                height="110"
                              />
                            </div>
                            <div class="title">Xiaomi Civi 1s</div>
                            <p class="price">2299元起</p>
                          </a>
                        </li>
                        <li>
                          <a href="">
                            <div class="figure">
                              <img
                                src="./images/l-3.webp"
                                alt="Xiaomi Civi 1s"
                                width="160"
                                height="110"
                              />
                            </div>
                            <div class="title">Xiaomi Civi 1s</div>
                            <p class="price">2299元起</p>
                          </a>
                        </li>
                        <li>
                          <a href="">
                            <div class="figure">
                              <img
                                src="./images/l-4.webp"
                                alt="Xiaomi Civi 1s"
                                width="160"
                                height="110"
                              />
                            </div>
                            <div class="title">Xiaomi Civi 1s</div>
                            <p class="price">2299元起</p>
                          </a>
                        </li>
                        <li>
                          <a href="">
                            <div class="figure">
                              <img
                                src="./images/l-6.jpg"
                                alt="Xiaomi Civi 1s"
                                width="160"
                                height="110"
                              />
                            </div>
                            <div class="title">Xiaomi Civi 1s</div>
                            <p class="price">2299元起</p>
                          </a>
                        </li>
                        <li>
                          <a href="">
                            <div class="figure">
                              <img
                                src="./images/l-6.png"
                                alt="Xiaomi Civi 1s"
                                width="160"
                                height="110"
                              />
                            </div>
                            <div class="title">Xiaomi Civi 1s</div>
                            <p class="price">2299元起</p>
                          </a>
                        </li>
                      </ul>
                    </div>
                  </div>
                </li>
                <li class="nav-item"><a href="" class="link">服务</a></li>
                <li class="nav-item"><a href="" class="link">社区</a></li>
              </ul>
            </div>

            <!-- 搜索框 -->
            <div class="header-search">
              <input type="text" class="search-text" placeholder="小米11" />
              <input
                type="submit"
                class="search-btn iconfont"
                value="&#xe6a2;"
              />
            </div>
          </div>
        </div>
      </div>
    </div>

    <!-- product-navbox -->
    <div>
      <div class="xm-product-box">
        <div class="nav-bar">
          <div class="productnav-con">
            <h2 class="J_pnavT">这里插入商品名</h2>
            <div class="con">
              <div class="con-left">
                <span class="separator">|</span>
                <a href="javascript:;" class="J_pnavT">这里插入商品名</a>
              </div>
              <div class="con-right">
                <a href="javascript">概述页</a>
                <span class="separator">|</span>
                <a href="javascript">参数页</a>
                <span class="separator">|</span>
                <a href="javascript">F码通道</a>
                <span class="separator">|</span>
                <a href="javascript">咨询客服</a>
                <span class="separator">|</span>
                <a href="javascript">用户评价</a>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>

    <!-- product -->
    <div class="product-main">
      <div class="product-box">
        <div class="product-left">
          <!-- <img src="./images/product.png" alt="" /> -->
        </div>
        <div class="product-right">
          <h2>Xiaomi智能家庭屏 10</h2>
          <p class="sale-desc">
            <font color="#ff4a00"
              >两件享9.7折，可跨品类凑单享折扣，购前先领券</font
            >MIUI Home｜10.1" 高清大屏｜仰角可调｜立体声双扬声器｜红外遥控 |
            115°超广角摄像头｜全场景家庭沟通｜8大视频平台｜儿童模式｜小爱同学｜家庭
            KTV｜摄像头隐私挡板
          </p>
          <p class="company-info">小米自营</p>
          <div class="price-info">
            <span>949元<del>999元</del></span>
          </div>
          <div class="line"></div>
          <div class="activity-box">
            <div class="coupon-box">
              <span class="coupon-tag">优惠劵</span>
              <span class="coupon-name">两件9.7折优惠券</span>
              <a href="javascript:;">立即领取 </a>
            </div>
          </div>
          <div class="address-box">
            <div class="product-address">
              <i class="iconfont icon-dizhi"></i>
              <div class="address-con">
                <div>
                  <div class="address-info">
                    <span>北京</span>
                    <span>北京市</span>
                    <span>海淀区</span>
                    <span>清河街道</span>
                  </div>
                  <a href="javascript:;" class="edit">修改</a>
                </div>
                <div class="info">
                  <div class="desc">
                    <span>有现货</span>
                  </div>
                </div>
              </div>
            </div>
          </div>
          <div class="buy-options">
            <div class="buy-box-child">
              <div class="option-box">
                <div class="title">选择版本</div>
                <ul class="type">
                  <li class="active">
                    <a href="javascript:;">8GB+28GB</a>
                  </li>
                  <li class>
                    <a href="javascript:;">8GB+28GB</a>
                  </li>
                  <li class>
                    <a href="javascript:;">8GB+28GB</a>
                  </li>
                  <li class>
                    <a href="javascript:;">8GB+28GB</a>
                  </li>
                </ul>
              </div>
              <div class="option-box">
                <div class="title">选择颜色</div>
                <ul class="color">
                  <li class="active">
                    <a href="javascript:;">黑色</a>
                  </li>
                </ul>
              </div>
            </div>
          </div>
          <div class="selected-list">
            <ul>
              <li>
                Xiaomi智能家庭屏 10 黑色
                <span>949元<del>999元</del></span>
              </li>
            </ul>
            <div class="total-price">总计: 949元</div>
          </div>
          <div class="btn-box">
            <div class="sale-btn">
              <a href="./shop.html" class="btn btn-primary">加入购物车</a>
            </div>
            <div class="favorite-btn">
              <a href="" class="btn-gray btn-like">
                <i class="iconfont icon-kongxin"></i>

                <span>喜欢</span>
              </a>
            </div>
          </div>
          <div class="after-sale-info">
            <span>
              <a href="support">
                <i class="iconfont icon-xianshi_xuanze"></i>
                <em>小米自营</em>
              </a>
            </span>
            <span>
              <a href="support">
                <i class="iconfont icon-xianshi_xuanze"></i>
                <em>小米发货</em>
              </a>
            </span>
            <span>
              <a href="support">
                <i class="iconfont icon-xianshi_xuanze"></i>
                <em>7天无理由退货</em>
              </a>
            </span>
            <span>
              <a href="support">
                <i class="iconfont icon-xianshi_xuanze"></i>
                <em>运费说明</em>
              </a>
            </span>
            <span>
              <a href="support">
                <i class="iconfont icon-xianshi_xuanze"></i>
                <em>企业信息</em>
              </a>
            </span>
            <span>
              <a href="support">
                <i class="iconfont icon-xianshi_xuanze"></i>
                <em>7天价格保护</em>
              </a>
            </span>
          </div>
        </div>
      </div>
    </div>

    <!-- c产品细节 -->
    <div class="product-detail">
      <div class="detail-container">
        <h3>价格说明</h3>
        <div class="img-box"><img src="./images/detail.png" alt="" /></div>
      </div>
    </div>

    <!-- footer -->
    <div>
      <div class="site-footer">
        <div class="container">
          <div class="footer-service">
            <ul class="list-service">
              <li class="first">
                <a href="">
                  <i class="iconfont icon-weixiu"></i>
                  预约维修服务
                </a>
              </li>
              <li>
                <a href="">
                  <i class="iconfont icon-7"></i>
                  7天无理由退货
                </a>
              </li>
              <li>
                <a href="">
                  <i class="iconfont icon-15"></i>
                  15天免费换货
                </a>
              </li>
              <li>
                <a href="">
                  <i class="iconfont icon-liwu"></i>
                  满69元包邮
                </a>
              </li>
              <li>
                <a href="">
                  <i class="iconfont icon-location"></i>
                  520余家售后网点
                </a>
              </li>
            </ul>
          </div>
          <div class="footer-links">
            <dl class="col-links">
              <dt>帮助中心</dt>
              <dd>账户管理</dd>
              <dd>购物指南</dd>
              <dd>订单操作</dd>
            </dl>
            <dl class="col-links">
              <dt>服务支持</dt>
              <dd>售后政策</dd>
              <dd>自助服务</dd>
              <dd>相关下载</dd>
            </dl>
            <dl class="col-links">
              <dt>线下门店</dt>
              <dd>小米之家</dd>
              <dd>服务网点</dd>
              <dd>授权体验店/专区</dd>
            </dl>
            <dl class="col-links">
              <dt>关于小米</dt>
              <dd>了解小米</dd>
              <dd>加入小米</dd>
              <dd>投资者关系</dd>
              <dd>企业社会责任</dd>
              <dd>廉洁举报</dd>
            </dl>
            <dl class="col-links">
              <dt>关注我们</dt>
              <dd>新浪微博</dd>
              <dd>官方微信</dd>
              <dd>联系我们</dd>
              <dd>公益基金会</dd>
            </dl>
            <dl class="col-links">
              <dt>特色服务</dt>
              <dd>F码通道</dd>
              <dd>礼物码</dd>
              <dd>防伪查询</dd>
            </dl>
            <div class="col-contact">
              <p class="phone">400-100-5678</p>
              <p class="time">8:00-18:00（仅收市话费）</p>
              <a href="" class="btn">
                <i class="iconfont icon-liaotian"></i>
                人工客服
              </a>
              <div class="follow">
                关注小米：
                <a href=""><i class="iconfont icon-weibo"></i></a>
                <a href="" class="wx"
                  ><i class="iconfont icon-weixin"></i>
                  <img src="./images/wx-img.png" alt="" />
                </a>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="site-info">
        <div class="container-info">
          <div class="info-loge">
            <img src="./images/logo-mi2.png" alt="" />
          </div>
          <div class="info-text">
            <p class="texts">
              <a href="">小米商城</a>
              <span>|</span>
              <a href="">MIUI</a>
              <span>|</span>
              <a href="">米家</a>
              <span>|</span>
              <a href="">米聊</a>
              <span>|</span>
              <a href="">多看</a>
              <span>|</span>
              <a href="">游戏</a>
              <span>|</span>
              <a href="">政企服务</a>
              <span>|</span>
              <a href="">小米天猫店</a>
              <span>|</span>
              <a href="">小米集团隐私政策</a>
              <span>|</span>
              <a href="">小米公司儿童信息保护规则</a>
              <span>|</span>
              <a href="">小米商城隐私政策</a>
              <span>|</span>
              <a href="">小米商城用户协议</a>
              <span>|</span>
              <a href="">问题反馈</a>
              <span>|</span>
              <a href="">Select Location</a>
            </p>
            <p class="texts">
              <a href="">北京互联网法院法律服务工作站</a>
              <span>|</span>
              <a href="">中国消费者协会</a>
              <span>|</span>
              <a href="">北京市消费者协会</a>
            </p>
            <p class="texts2">
              &copy;
              <a href="">mi.com</a>
              京ICP证110507号
              <a href="">京ICP备10046444号</a>
              <a href=""> 京公网安备11010802020134号</a>
              <a href="">京网文[2020]0276-042号</a>
              <br />
              <a href=""> （京）网械平台备字（2018）第00005号</a>
              <a href=""> 互联网药品信息服务资格证 (京)-非经营性-2014-0090</a>
              <a href=""> 营业执照</a>
              <a href="">医疗器械质量公告</a>
              <br />
              <a href="">增值电信业务许可证</a>
              &nbsp;网络食品经营备案 京食药网食备202010048&nbsp;
              <a href="">食品经营许可证</a>
              <br />
              违法和不良信息举报电话：171-5104-4404 mi.com 京ICP证110507号
              <a href="">知识产权侵权投诉</a>
              &nbsp;本网站所列数据，除特殊说明，所有数据均出自我司实验室测试
            </p>
          </div>
          <div class="info-links">
            <img src="./images/truste.png" alt="" />
            <img src="./images/v-logo-2.png" alt="" />
            <img src="./images/honest.png" alt="" />
            <img src="./images/xiaofei.png" alt="" />
            <img src="./images/js-1.png" alt="" />
          </div>
        </div>
        <div class="solgan">
          <span> 让全球每个人都能享受科技带来的美好生活 </span>
        </div>
      </div>
    </div>
    <!-- fix锚点跳转 -->
    <!--   <div class="fixed"></div> -->
  </body>
</html>
<script src="./js/product.js" type="module"></script>
